<template>
    <div class="select_class">
        <mt-loadmore :autoFill='false' :bottom-method="loadBottom" :bottom-all-loaded="allLoaded" ref="allLoaded">
            <ul >
                <li v-for="(item,index) in showData" @click="showDetail(index)">
                    <div class="main" style="flex-wrap:nowrap" >
                        <div class="head">
                            <img :src="$api.formatterImg(item.filePath)" />
                        </div>
                        <div class="classroom">
                            <div class="className">{{item.title}}</div>
                            <div class="teacher">{{item.messageContent}}</div>
                        </div>
                        <div class="right flex_column" style="flex-grow: 1;" >     
                            <div class="teacher" style="text-align:right;" >{{new Date(item.createTime).Format('yyyy-MM-dd hh:mm:ss')}}</div>
                            <div></div>
                        </div>
                    </div>
                </li>
            </ul>
        </mt-loadmore>
    </div>
</template>
<script>
    import {
        MessageBox
    } from 'mint-ui'
    export default {
        name: "serviceList",
        data() {
            return {
                showData: [],
                pageSize: 10,
                pageNum: 1,
                allLoaded: false,
                useInfo: {},
            };
        },
        methods: {
            showDetail(index) { //查看消息详情,不知道用不用得上,

            },
            loadBottom() {
                this.pageNum++;
                this.getList('push');
            },
            getList(push) {
                var url = '/message/selectPage'
                if (!push) {
                    this.pageNum = 1;
                }
                var params = {
                    pageNum: this.pageNum,
                    pageSize: this.pageSize,
                    userId: this.useInfo.userId,
                    schoolId: this.useInfo.schoolId,
                    messageType: this.messageType,
                }
                this.$api.post(url, params, (data) => {
                    if (push) {
                        data.info.list.forEach(element => {
                            this.showData.push(element);
                        })
                    } else {
                        this.showData = data.info.list;
                    }
                    if (data.info.total == this.showData.length) {
                        this.allLoaded = true;
                    }
                    this.$refs.allLoaded.onBottomLoaded();
                })
            },
            getUserInfo() {
                this.useInfo = JSON.parse(sessionStorage.getItem('useInfo'));
            },
        },
        props: ['messageType', 'show'],
        watch: {
            show(newValue) {
                if (newValue) {
                    this.getUserInfo();
                    this.getList();
                }
            }
        },
        created() {
            if (this.show) {
                this.getUserInfo();
                this.getList();
            }
        }
    }
</script>